<template>
    <div class="home">
       <div class="header">
            <van-icon name="arrow-left" @click="leftClick" />
            <div class="center">新增拜访信息</div>
            <van-icon name="wap-home-o" @click="indexClick" />
       </div>
        <van-cell-group>
          <van-field
            v-model="username"
            error
            required
            label="客户名称"
            placeholder="下拉搜索"
            right-icon="arrow-down"
            class="active"
            @click-right-icon="selectClick"
           />
        </van-cell-group>
       
         <!-- 单元格 -->
     <van-cell-group>
      <van-field
        v-model="titles"
        error
        required
        label="拜访标题"
      />
      <van-popup v-model="showPicker3" round position="bottom">
        <van-picker
          show-toolbar
          :columns="columnsTitle"
          @cancel="showPicker3 = false"
          @confirm="onConfirm3"
        />
      </van-popup>
      <van-field
        v-model="values"
        required
        label="拜访原因"
        right-icon="arrow"
        position="top"
        :style="{ height: '40%' }"
        @click="showPicker = true"
      >
      </van-field>
      <van-popup v-model="showPicker" round position="bottom">
        <van-picker
          show-toolbar
          :columns="columns"
          @cancel="showPicker = false"
          @confirm="onConfirm"
        />
      </van-popup>
      <van-field
        v-model="timeVal"
        required
        label="拜访时间"
        right-icon="arrow"
        @click="showPicker2 = true"
      >
      </van-field>
      <van-popup
        v-model="showPicker2"
        position="bottom"
        :style="{ height: '30%' }"
        ><van-datetime-picker
          v-model="currentDate"
          type="datetime"
          :min-date="minDate"
          :max-date="maxDate"
          @cancel="showPicker2 = false"
          @confirm="onConfirm2"
      /></van-popup>
    </van-cell-group>
    <!-- 大文本框 -->
     <van-cell-group>
      <van-field
        v-model="site"
        rows="2"
        autosize
        label="拜访地址"
        type="textarea"
        placeholder="请输入"
        show-word-limit
    /></van-cell-group>
    <van-cell-group>
      <van-field
        v-model="situation"
        rows="2"
        autosize
        label="拜访情况"
        type="textarea"
        placeholder="请输入"
        show-word-limit
    /></van-cell-group>
    <van-cell-group>
      <van-field
        v-model="info"
        rows="2"
        autosize
        label="竞争信息收集情况"
        type="textarea"
        placeholder="请输入"
        show-word-limit
    /></van-cell-group>
    <div class="down">
      <button @click="saveClick">保存</button>
    </div>
    </div>
</template>

<script>
import { Toast } from 'vant';
import {GetNewAdd} from '../raxios/api'
export default {
    data () {
        return {
            username:this.$route.query.custName,
             currentDate: new Date(),
             titles:'',
             username: this.$route.query.custName,
             values: "",
             time: "",
             site: "",
             situation: "",
             info: "",
             show1: false,
             show2: false,
             showPicker: false,
             columns: ["例行走访", "售中支撑", "售前支撑"],
             columnsTitle: ["例行走访2", "售中支撑2", "售前支撑2"],
             minDate: new Date(2020, 0, 1),
             maxDate: new Date(2025, 10, 1),
             currentDate: new Date(),
             timeVal: "",
             // timeVal: "2020-10-05 00:00:00",
             showPicker2: false,
             showPicker3: false,
        }
    },
    methods:{
        leftClick(){
          this.$router.go(-1)
        },
        indexClick(){

        },
        selectClick(){
            this.$router.push('/home/SelectKehu')
        },
         formatter(type, val) {
            if (type === 'year') {
              return val + '年';
            }
            if (type === 'month') {
              return val + '月';
            }
            if (type === 'day') {
              return val + '日';
            }
            return val;
          },
    onConfirm(values) {
      (this.values = values), (this.showPicker = false);
    },
    onConfirm3(value) {
      (this.titles = value), (this.showPicker3 = false);
    },
    onCancel() {
      // Toast("取消");
    }, //时间
    onConfirm2(value) {
      // console.log(value);
      // this.timeVal= value.toLocaleDateString().replace(/\//g, "-") + " " + value.toTimeString().substr(0, 8)
      // this.showPicker2 = false;
      // this.timeVal="2020-10-05 00:00:00"
      //时间戳 年月日
      let date = new Date(value);
      let y = date.getFullYear();
      let MM = date.getMonth() + 1;
      MM = MM < 10 ? "0" + MM : MM;
      let d = date.getDate();
      d = d < 10 ? "0" + d : d; //时分秒
      let date2 = new Date();
      let h = date2.getHours();
      h = h < 10 ? "0" + h : h;
      let m = date2.getMinutes();
      m = m < 10 ? "0" + m : m;
      let s = date2.getSeconds();
      s = s < 10 ? "0" + s : s;
      let time = y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s; //赋值
      this.timeVal = time;
      this.showPicker2 = false;
      console.log(this.timeVal);
    },
        saveClick() {
      // console.log({
      //   custId: this.$route.query.id,
      //   custName: this.username,
      //   visitTime: this.timeVal,
      //   visitAddress: this.site,
      //   visitTitle: this.titles,
      //   visitReason: this.values,
      //   visitSituation: this.situation,
      //   collectSituation: this.info,
      // });

      GetNewAdd({
        custId: this.$route.query.id,
        custName: this.username,
        visitTime: this.timeVal,
        visitAddress: this.site,
        visitTitle: this.titles,
        visitReason: this.values,
        visitSituation: this.situation,
        collectSituation: this.info,
      }).then((res) => {
        if (res.errCode == 0) {
          console.log(res);
          Toast.success('新增成功');
          setTimeout(() => {
            this.$router.push('/home/Seelist')
          }, 1000);
        }
      });

    },
    }
}
</script>
 
<style lang = "less" scoped>
.home{
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: #efefef;
    z-index: 99;

}
.header {
  height: 0.3rem;
  background-color: #003399;
  padding: 0.1rem;
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.1rem;
  .van-icon {
    font-size: 0.28rem;
    color: #fff;
  }
  .center {
    font-size: 0.18rem;
    color: #fff;
    margin-top: 0.06rem;
  }
}
.down {
  width: 100%;
  height: 0.6rem;
  background-color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  button {
    width: 96%;
    height: 0.4rem;
    position: absolute;
    left: 50%;
    margin-left: -48%;
    top: 0.1rem;

    background-color: #cde7ff;
    color: #fff;
    border-radius: 0.4rem;
    font-size: 0.16rem;
    border: 0;
  }
}
</style>